$(document).ready(function () {

    $("#all").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
    <div class="artist-container">
        <img src="image\\zhou.jpg" alt="picture">
        <span><a href="zhou.html" class="my-link">周杰伦</a></span>
    </div>
    <div class="artist-container">
        <img src="image\\chen.webp" alt="picture">
        <span>陈奕迅</span>
    </div>
    <div class="artist-container">
        <img src="image\\zhang.webp" alt="picture">
        <span>张杰</span>
    </div>
    <div class="artist-container">
        <img src="image\\lin.jpg" alt="picture">
        <span>林俊杰</span>
    </div>
</div>

<br>

<div class="singer">
    <div class="artist-container">
        <img src="image\\huang.jpg" alt="picture">
        <span>黄家驹</span>
    </div>
    <div class="artist-container">
        <img src="image\\alan.webp" alt="picture">
        <span>Alan Walker</span>
    </div>
    <div class="artist-container">
        <img src="image\\wang.jpg" alt="picture">
        <span>王绎龙</span>
    </div>
    <div class="artist-container">
        <img src="image\\bei.webp" alt="picture">
        <span>贝多芬</span>
    </div>

    <!--    
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
-->

</div>
`);
    });

//     $("#huayu").click(function () {
//         $(".totalsinger").html(`
    
// `);
//     });
    
    $("#huayu").click(function () {
        $(".totalsinger").html(`
<div class="singer">
<div class="artist-container">
        <img src="image\\zhou.jpg" alt="picture">
        <span><a href="zhou.html" class="my-link">周杰伦</a></span>
    </div>
<div class="artist-container">
    <img src="image\\chen.webp" alt="picture">
    <span>陈奕迅</span>
</div>
<div class="artist-container">
    <img src="image\\zhang.webp" alt="picture">
    <span>张杰</span>
</div>
<div class="artist-container">
    <img src="image\\lin.jpg" alt="picture">
    <span>林俊杰</span>
</div>
</div>

<br>

<div class="singer">
<div class="artist-container">
    <img src="image\\wang.jpg" alt="picture">
    <span>王绎龙</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#oumei").click(function () {
        $(".totalsinger").html(`

<div class="singer">
<div class="artist-container">
    <img src="image\\alan.webp" alt="picture">
    <span>Alan Walker</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#riben").click(function () {
        $(".totalsinger").html(`
<div class="singer">
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#hanguo").click(function () {
        $(".totalsinger").html(`
<div class="singer">
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#all").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
    <div class="artist-container">
        <img src="image\\zhou.jpg" alt="picture">
        <span><a href="zhou.html" class="my-link">周杰伦</a></span>
    </div>
    <div class="artist-container">
        <img src="image\\chen.webp" alt="picture">
        <span>陈奕迅</span>
    </div>
    <div class="artist-container">
        <img src="image\\zhang.webp" alt="picture">
        <span>张杰</span>
    </div>
    <div class="artist-container">
        <img src="image\\lin.jpg" alt="picture">
        <span>林俊杰</span>
    </div>
</div>

<br>

<div class="singer">
    <div class="artist-container">
        <img src="image\\huang.jpg" alt="picture">
        <span>黄家驹</span>
    </div>
    <div class="artist-container">
        <img src="image\\alan.webp" alt="picture">
        <span>Alan Walker</span>
    </div>
    <div class="artist-container">
        <img src="image\\wang.jpg" alt="picture">
        <span>王绎龙</span>
    </div>
    <div class="artist-container">
        <img src="image\\bei.webp" alt="picture">
        <span>贝多芬</span>
    </div>

    <!--    
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
-->

</div>
`);
    });

    $("#hanguo").click(function () {
        $(".totalsinger").html(`
<div class="singer">
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#man").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
    <div class="artist-container">
        <img src="image\\zhou.jpg" alt="picture">
        <span><a href="zhou.html" class="my-link">周杰伦</a></span>
    </div>
    <div class="artist-container">
        <img src="image\\chen.webp" alt="picture">
        <span>陈奕迅</span>
    </div>
    <div class="artist-container">
        <img src="image\\zhang.webp" alt="picture">
        <span>张杰</span>
    </div>
    <div class="artist-container">
        <img src="image\\lin.jpg" alt="picture">
        <span>林俊杰</span>
    </div>
</div>

<br>

<div class="singer">
    <div class="artist-container">
        <img src="image\\huang.jpg" alt="picture">
        <span>黄家驹</span>
    </div>
    <div class="artist-container">
        <img src="image\\alan.webp" alt="picture">
        <span>Alan Walker</span>
    </div>
    <div class="artist-container">
        <img src="image\\wang.jpg" alt="picture">
        <span>王绎龙</span>
    </div>
    <div class="artist-container">
        <img src="image\\bei.webp" alt="picture">
        <span>贝多芬</span>
    </div>

    <!--    
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
-->

</div>
`);
    });

    $("#woman").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#dianzi").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
            <div class="artist-container">
        <img src="image\\alan.webp" alt="picture">
        <span>Alan Walker</span>
    </div>
    <div class="artist-container">
        <img src="image\\wang.jpg" alt="picture">
        <span>王绎龙</span>
    </div>
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>

<br>

<div class="singer">
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

    <!--    
    <div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
-->

</div>
`);
    });

    $("#minyao").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
            <div class="artist-container">
        <img src="image\\bei.webp" alt="picture">
        <span>贝多芬</span>
    </div>
    <div class="artist-container">
        <img src="image\\huang.jpg" alt="picture">
        <span>黄家驹</span>
    </div>

    <div class="artist-container">
        <img src="image\\zhou.jpg" alt="picture">
        <span><a href="zhou.html" class="my-link">周杰伦</a></span>
    </div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });

    $("#qita").click(function () {
        $(".totalsinger").html(`
        <div class="singer">
            <div class="artist-container">
        <img src="image\\chen.webp" alt="picture">
        <span>陈奕迅</span>
    </div>
    <div class="artist-container">
        <img src="image\\zhang.webp" alt="picture">
        <span>张杰</span>
    </div>
    <div class="artist-container">
        <img src="image\\lin.jpg" alt="picture">
        <span>林俊杰</span>
    </div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>    
<br>
<div class="singer">
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>

<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
<div class="artist-container">
    <img src="image\\niming.jpg" alt="picture">
    <span>正在引入中...</span>
</div>
</div>
`);
    });
});